import React, { Component } from 'react';
import _ from 'lodash';
import moment from 'moment';
import Former, { validate } from '../../../components/Former';
import Button from '../../../components/Button';
import { idCardRule, mobileRule } from '../../../utils/rules';
import { gender } from '../../../common/baseData';
import detail from '../models/customer';

export default class From extends Component {
  _validate = () => {
    validate((err, val) => {
      if (!err && _.isFunction(this.props.onSubmit)) {
        if (detail.customer.customerId) {
          val.customerId = detail.customer.customerId;
        }
        this.props.onSubmit(val);
      }
    });
  };
  render() {
    const { customer = {} } = detail;
    const fields = [
      {
        label: '姓名',
        placeholder: '请输入客户姓名',
        type: 'TextInput',
        key: 'name',
        initialValue: customer.name,
        rules: [{ require: true }]
      },
      {
        label: '身份证号',
        placeholder: '请输入客户身份证号',
        type: 'TextInput',
        key: 'idCardNo',
        initialValue: customer.idCardNo,
        rules: [
          {
            validation: (value, cb) => {
              if (value && !idCardRule(value)) {
                cb('身份证号格式不正确');
              } else {
                cb();
              }
            }
          }
        ]
      },
      {
        label: '手机号',
        placeholder: '请输入客户手机号',
        type: 'TextInput',
        key: 'mobile',
        initialValue: customer.mobile,
        rules: [
          {
            validation: (value, cb) => {
              if (value && !mobileRule(value)) {
                cb('手机号格式不正确');
              } else {
                cb();
              }
            }
          }
        ]
      },
      {
        label: '性别',
        placeholder: '请选择客户性别',
        type: 'Selecter',
        key: 'gender',
        initialValue: customer.gender,
        options: gender
      },
      {
        label: '生日',
        placeholder: '请选择客户生日',
        type: 'Date',
        key: 'birthday',
        mode: 'date',
        initialValue: customer.birthday || moment().format('YYYY-MM-DD'),
        maxDate: moment().add(1, 'd').format('YYYY-MM-DD'),
      }
    ];
    return (
      <Former
        fields={fields}
        bottom={
          <Button
            onPress={this._validate}
            type="primary"
            title="提交新客户资料"
          />
        }
      />
    );
  }
}
